import { defineComponent } from 'vue'
import { Col, Row } from 'ant-design-vue'
import '@/views/index.scss'
import { useRouter } from 'vue-router'

export default defineComponent({
  name: 'homeList',
  setup() {
    const router = useRouter()

    const handleClick = (item: any): void => {
      router.push('content')
    }

    return () => (
      <div>
        <Row type="flex" justify="space-around" align="middle" class="list-box" onClick={() => handleClick(1)}>
          <Col span={4}>
            <img width={200} src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
                 alt="1212"/>
          </Col>
          <Col span={20} class="list">
            <Row><Col span={24} class="list-title">大标题父标题</Col></Row>
            <Row><Col span={24} class="list-content">小内容小内容小内容小内容小内容小内容</Col></Row>
            <Row><Col span={24} class="list-time">2020-11-26</Col></Row>
          </Col>
        </Row>
        <Row type="flex" justify="space-around" align="middle" class="list-box">
          <Col span={4}>
            <img width={200} src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
                 alt="1212"/>
          </Col>
          <Col span={20} class="list">
            <Row><Col span={24} class="list-title">大标题父标题</Col></Row>
            <Row><Col span={24} class="list-content">小内容小内容小内容小内容小内容小内容</Col></Row>
            <Row><Col span={24} class="list-time">2020-11-26</Col></Row>
          </Col>
        </Row>
      </div>
    )
  }
})
